<template>
  <forms ref="forms" :config="config" @submit:forms="onsubmit" :btns="btns">
    <template #config="{row}">
      <p v-for="(v,i) in row.value" style="line-height: 1.6;padding: 02px;">
        <input type="hidden" :name="'config['+i+'][title]'" :value="v.title">
        <input type="hidden" :name="'config['+i+'][additional_ids]'" :value="v.additional_ids">
        <input type="hidden" :name="'config['+i+'][multiple]'" :value="v.multiple">
        <input type="hidden" :name="'config['+i+'][required]'" :value="v.required">
        <span v-if="v.required==1">(必选)</span>{{v.multiple==1?'多':'单'}}选项：{{v.title}}[<span v-for="v2 in v.list" class="button on" style="margin: 0 2px;">{{v2.title}}</span>]
        <el-button size="small" type="danger" @click="row.value.splice(i,1)">删除</el-button>
      </p>
      <json_param :config="json_param_config" v-model:value="config_row"></json_param>
      <el-button @click="add_config" size="small">添加</el-button>
    </template>
  </forms>
</template>

<script>
export default {
  props: ['__iframe'],
  data(){
    let id = this.$get('id'), btns = undefined;
    let model = {name:this.$get('model_name'), alias:this.$get('model_alias','')};
    if (!id || !model.name) {
      if (this.__iframe){
        iframe.remove('additional_edit');
      }else {
        this.$router.push('index?'+this.param());
      }
    }
    let forms_config = {
      config: {label:'附加项',name:'config',type:'config',tips:'',value:[]},
    }
    return {
      id: id,
      model: model,
      btns: btns,
      config: forms_config,
      json_param_config: {
        title: {label:'选项标题',name:'title',type:'text_one',tips:''},
        additional_ids: {label:'附加项选择',name:'additional_ids',type:'list_ids',config:'additional/index',tips:''},
        multiple: {label:'是否多选',name:'multiple',type:'radio_switch',config:['否','是'],tips:'',value: 0},
        required: {label:'是否必选',name:'required',type:'radio_switch',config:['否','是'],tips:'',value: 0},
      },
      config_row: '{}',
    }
  },
  methods: {
    param(data){
      data = data || {};
      data.model_name = this.model.name;
      data.model_alias = this.model.alias;
      return s94Mjs.param_encode(data);
    },
    onsubmit(formData){
      let row = JSON.parse(this.config_row);
      if (row.title || row.additional_ids){
        this.$confirm('存在未添加的附加项目配置，如果提交未添加的配置项会被舍弃，是否舍弃', '操作确定').then(()=>{
          this.config_row = '{}';
          this.send(formData);
        }).catch(()=>{})
      }else {
        this.send(formData);
      }
    },
    send(formData){
      let url = this.id ? `/admin/${this.model.name}/additional_edit?id=`+this.id : '/admin/additional/add';
      ajax({url:url, method:'POST', data:formData}, (res)=>{
        if (this.__iframe){
          iframe.exe('edit?'+this.param({id:this.id}), 'get_info');
          iframe.hide('additional_edit');
          if (!this.id) this.$refs['forms'].init();
        }else {
          this.$router.push('index?'+this.param());
        }
      }, (res)=>{
        if (res.errors) this.$refs['forms'].errors = res.errors;
      })
    },
    add_config(callback){
      let app = this;
      callback = typeof(callback) =='function' ? callback : function (){ app.$message.success('添加完成');}
      let row = JSON.parse(app.config_row);
      if (!row.title) return app.$message.error('选项标题不能为空！');
      if (!row.additional_ids) return app.$message.error('附加项不能为空！');
      ajax({
        url: '/admin/additional/list',
        data: {'where[id][in]': row.additional_ids},
        loading: true,
      }, function (res){
        let list = res.data.list;
        if (!list.length) return app.$message.error('附加项不能为空！');
        row.list = list;
        app.config.config.value.push({
          title: row.title,
          additional_ids: row.additional_ids,
          list: list,
          multiple: row.multiple || 0,
          required: row.required || 0,
        })
        app.config_row = '{}';
        callback();
        return false;
      })
    },
  },
  mounted() {
    let app = this;
    if (!this.__iframe) window['app'] = this;
    if (this.id) {
      ajax({url:'/admin/'+this.model.name+'/info?ac=additional&id='+this.id,cache:true}, (res)=>{
        this.$refs['forms'].init(res.data);
        return false
      }, ()=>{
        if (this.__iframe){
          iframe.remove('additional_edit');
        }else {
          this.$router.push('index?'+this.param());
        }
      })
    }

    //其他初始化操作
  }
}
</script>
